<template>
  <div>
    <el-table :data="data" border stripe style="width: 100%">
      <el-table-column prop="indicatorid" label="指标ID" width="180" />
      <el-table-column prop="indicatorname" label="名称" />
      <el-table-column prop="indicatorcontent" label="内容" />
      <el-table-column prop="indicatordescription" label="描述" />
      <el-table-column prop="amount" label="数值" width="100" />
      <el-table-column prop="unit" label="单位" width="80" />
    </el-table>

    <div style="text-align: right; margin-top: 10px">
      <el-pagination
        background
        layout="prev, pager, next"
        :total="total"
        :current-page="page"
        :page-size="10"
        @current-change="handlePageChange"
      />
    </div>
  </div>
</template>

<script setup>
import { defineProps, defineEmits } from 'vue'

const props = defineProps({
  data: Array,
  total: Number,
  page: Number
})

const emit = defineEmits(['pageChange'])

const handlePageChange = (val) => {
  emit('pageChange', val)
}
</script>